<!--
 * @Author: likaiji
 * @Date: 2019-08-25 19:41:20
 * @LastEditors: likaiji
 * @LastEditTime: 2021-07-18 17:58:34
 * @Description: file content
 * @FilePath: /sale-books/pages/index/index.vue
-->
<template>
    <view class="content">
        <!-- isbn:
        <input type="text" class="isbn_input" v-model="isbn" /> -->
        <button class="scan_btn" @click="scanBooks">扫描图书编码</button>
		<ul>
			<li v-for="(item, index) in list" :key="index">
				<img :src="item.photoUrl" class="img" alt="">
				<div class="name">
					<p>{{item.name}}</p>
				</div>
			</li>
		</ul>
    </view>
</template>

<script>
export default {
    data() {
        return {
            isbn: "",
			list:[]
        };
    },
    onLoad() {
		this.getBooks()
	},
    methods: {
		getBooks(){
			uniCloud.callFunction({
				name:"getBooks",
				data:{
					// lastId:"60f7ea9a90c55000011832ff",
					// pageSize:2	
				},
				success:(res)=> {
					this.list = res.result.data
					console.log(this.list)
				}
			})
		},
        scanBooks() {
            uni.scanCode({
                // onlyFromCamera: true,
                success: (res) => {
                    this.queryIsbn(res.result);
                },
                fail: (err) => {
                    console.log(err);
                },
            });
        },
        queryIsbn(isbn) {
            uniCloud.callFunction({
                name: "ISBNQuery",
                data: {
                    isbn: isbn,
                },
                success: (res) => {
                    this.getBooks()
                },
            });
        },
    },
};
</script>

<style>
.scan_btn {
    width: 200px;
}
li{
	display: flex;
}
.img{
	width: 100px;
	height: 100px;
}
.name{
	/* float: right;
	line-height: 100px; */
	/* width: calc(100% - 100px); */
	display: flex;
	flex: 1;
	justify-content: flex-end;
}
.name p{
	width: 100%;
	line-height: 100px;
	text-align: left;
}
</style>
